<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>个人中心</title>
      <link rel="stylesheet" type="text/css" href="../../css/api.css" />
      <link rel="stylesheet" type="text/css" href="../../css/common.css" />
      <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    	<link rel="stylesheet" type="text/css" href="../../css/aui-pull-refresh.css" />
      <style>
          html, body {width: 100%;min-height: 100%;background: #F3EFEE;}
          .aui-active .aui-bar-tab-label{
            color: #f5a51c
          }
          .login {height:240px;background-image: -webkit-linear-gradient(0deg, #f5c674, #ed824c);/*background-image: url(../../image/personal_bkg.jpg);background-repeat: no-repeat; background-size: cover;*/position: relative;}
      	.login .personal_logo {width: 4rem;height: 4rem;border-radius: 50%;margin: 0 auto 9px;/*position: absolute; top: 60px; left: 20px;*/}
      		.login .userinfo {position: absolute; top: 60px;text-align: center; left: 0; right: 0;}
      		.login .userinfo .title {font-size: 0.8rem; color: #fff;}

      		/* 设置条目 */
      		.item {height: 3rem;line-height: 3rem;padding-left: 0.7rem;background-color: #fff;}
      		.item_ico {float: left;width: 2.3rem;padding: 0.7rem 0.7rem 0.7rem 0;}
      		.item_arrow {float: right;width: 1.5rem;padding: 1rem 0.7rem 1rem 0;}
      		.item span {font-size: 0.7rem;}
          [v-cloak] {
              display: none;
          }
          .aui-toast-content{
            color: #fff;
          }
      </style>
  </head>
  <body>
<div id="app" v-cloak>
  <header id="header_top" class="aui-bar aui-bar-nav aui-bar-light">
    <a class="aui-pull-left" @click="goback()">
        <span class="aui-iconfont aui-icon-left"></span>
    </a>
    <div class="aui-title changeTitle">编辑收货地址</div>
  </header>
<div class="user_nav_line"></div>
  <div class="aui-refresh-content">
    <ul class="aui-list aui-form-list">

     <li class="aui-list-item  aui-list-item-arrow"  @click="addAbout">
         <div class="aui-list-item-inner">
             <div class="aui-list-item-label">
                所在地区
             </div>
             <div class="aui-list-item-right" style="padding-right: 1rem;">{{usercity}}</div>
         </div>
     </li>
     <li class="aui-list-item">
         <div class="aui-list-item-inner">
             <div class="aui-list-item-label">
                 详细地址
             </div>
             <div class="aui-list-item-input">
                 <input type="text" :placeholder=userAdd style="font-size:0.6rem" v-model="userAdd"/>
             </div>
         </div>
     </li>
     <li class="aui-list-item">
           <div class="aui-list-item-inner">
               <div class="aui-list-item-title" style="font-size:0.7rem">设置默认地址</div>
               <div class="aui-list-item-right" style="margin-right:0.5rem">
                   <input type="checkbox" class="aui-switch">
               </div>
           </div>
       </li>
   </ul>
  <button type="button" name="button" class="shopping_btn" @click="shopping_btn()" style="border-radius:1.5rem;">确认</button>
  </div>
<div>

</div>

  </body>
  <script type="text/javascript" src="../../script/api.js"></script>
  <script type="text/javascript" src="../../script/zepto.js"></script>
  <script type="text/javascript" src="../../script/vue.min.js"></script>
  <script type="text/javascript" src="../../script/utils.js"></script>
  <script type="text/javascript" src="../../script/common.js"></script>
  <script type="text/javascript" src="../../script/aui-tab.js"></script>
  <script type="text/javascript" src="../../script/aui-scroll.js"></script>
  <script type="text/javascript" src="../../script/aui-pull-refresh.js"></script>
  <script type="text/javascript" src="../../script/aui-popup.js"></script>
  <script type="text/javascript" src="../../script/aui-dialog.js"></script>
  <script type="text/javascript" src="../../script/address_data.js"></script>
  <script type="text/javascript" src="../../script/aui-toast.js"></script>
  <script type="text/javascript">

      function shopping_btn(){
          api.closeWin();
      }
      var popup = new auiPopup();
         function showPopup(){
             popup.show(document.getElementById("top-right"))
         }


  </script>
  <script>
  apiready = function(){
    var toast = new auiToast({});
    new Vue({
      el:'#app',
      data:{
         userProvince:'',
         userMaincity:'',
         userCounty:'',
         userAdd:'',
         usercity: ''
      },
      methods:{
        //刷新
        setRefresh:function() {
            var pullRefresh = new auiPullToRefresh({
                container: document.querySelector('.aui-refresh-content'),
                triggerDistance: 100
            }, function(ret) {

                if (ret.status == "success") {
                    setTimeout(function() {
                        pullRefresh.cancelLoading(); //刷新成功后调用此方法隐藏
                    }, 1500)
                }
            })
        },
        //关闭当前页
        goback:function(){
          api.closeWin();
        },
        //详细地址
        addAbout:function(){
          var _this = this;
          var UIActionSelector = api.require('UIActionSelector');
          UIActionSelector.open({
              datas: address_data,
              layout: {
                  row: 5,
                  col: 3,
                  height: 40,
                  size: 12,
                  sizeActive: 14,
                  rowSpacing: 5,
                  colSpacing: 10,
                  maskBg: 'rgba(0,0,0,0.2)',
                  bg: '#fff',
                  color: '#888',
                  colorActive: '#f00',
                  colorSelected: '#f00'
              },
              animation: true,
              cancel: {
                  text: '取消',
                  size: 12,
                  w: 90,
                  h: 35,
                  bg: '#fff',
                  bgActive: '#ccc',
                  color: '#888',
                  colorActive: '#fff'
              },
              ok: {
                  text: '确定',
                  size: 12,
                  w: 90,
                  h: 35,
                  bg: '#fff',
                  bgActive: '#ccc',
                  color: '#888',
                  colorActive: '#fff'
              },
              title: {
                  text: '请选择',
                  size: 12,
                  h: 44,
                  bg: '#eee',
                  color: '#888'
              },
              fixedOn: api.frameName
          }, function(ret, err) {
              if (ret.eventType == "ok") {
                  _this.usercity = ''
                  // for(var i in ret.selectedInfo) { _this.usercity += ret.selectedInfo[i].name }
                  _this.usercity += _this.userProvince = ret.level1;
                  _this.usercity += _this.userMaincity = ret.level2 || ' ';
                  _this.usercity += _this.userCounty = ret.level3 || ' ';
              }
          });
        },
        //修改地址
        shopping_btn:function(){
          var _this= this;
          var toast = new auiToast();
          var map = api.require('bMap');
          map.getCoordsFromName({
                  city:_this.userMaincity,
                  address: _this.usercity
            }, function(ret, err) {
                  if (ret.status) {


         if(_this.userProvince == ""){
           toast.fail({
                 title:"请选择地区",
                 duration:2000
             });
             return;
         }
          // if($('.aui-switch').attr('checked')){
          //   _this.isDefault=1;
          // }else{
          //   _this.isDefault=2;
          //
          // }
          api.ajax({
              url: window.Url.Freestore_setInfo,
              method: 'post',
              data: {
                  values: {
                      token:$api.getStorage('token'),
                      province:_this.userProvince,
                      city:_this.userMaincity,
                      district:_this.userCounty,
                      address:_this.userAdd,
                      longitude:ret.lon,
                      latitude:ret.lat
                  }
              }
          },function(ret, err){
              if (ret.re==1) {
                  // alert( JSON.stringify( ret ) );
                  toast.success({
                      title:ret.info,
                      duration:1000
                  });
                  //重新加载
                  api.execScript({
                      name: 'storeTheData',
                      // frameName: 'type',
                      script: 'window.location.reload()'
                  });
                  api.execScript({
                      name: 'storeAddData',
                      // frameName: 'type',
                      script: 'window.location.reload()'
                  });
                  setTimeout(function(){api.closeWin()},1000)

              } else {
                toast.fail({
                    title:ret.info,
                    duration:2000
                });
                  //alert( JSON.stringify( err ) );

                  }
              });
            }
          });
        },

      },
      mounted:function(){
        this.setRefresh();
      }
    })
  };

  </script>
  </html>
